<!-- 探针采集管理 -->
<template>
	<div class="container">
		<!-- 搜索条件 -->
		<yd-form ref="myForm" :options="formOptions" :model="formData" :btns="formBtns"></yd-form>

		<!--查询列表-->
		<YdTable
			:formData="formData"
			:tableConfig="tableConfig"
			:tableData="tableData"
			ref="multipleTable"
			@sizeChangeHandler="queryGrid"
			@currentChangeHandler="queryGrid"
			@sortChangeHandler="queryGrid"
			@selectionChangeHandler="handleSelectionChange"
		>
		</YdTable>

		<!-- 查看接口对话框 -->
		<el-dialog
			:title="title"
			v-model="open.interfaceDialog"
			width="900px"
			append-to-body
			center
			@close="cancelInterfaceDialogHandle"
			:close-on-click-modal="false"
		>
			<!--查询列表-->
			<YdTable
				:formData="interfaceFormData"
				:tableConfig="interfaceTableConfig"
				:tableData="interfaceTableData"
				@sizeChangeHandler="interfaceQueryGrid"
				@currentChangeHandler="interfaceQueryGrid"
				@sortChangeHandler="interfaceQueryGrid"
			>
			</YdTable>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="cancelInterfaceDialogHandle">关 闭</el-button>
			</template>
		</el-dialog>

		<!-- 添加或修改参数配置对话框 -->
		<el-dialog
			:title="title"
			v-model="open.probeAddDialog"
			width="600px"
			append-to-body
			center
			@close="cancelProbeDialogHandle"
			:close-on-click-modal="false"
		>
			<el-form ref="conForm" :model="form" :rules="rules" label-width="150px">
				<el-row>
					<el-col :span="24">
						<el-form-item label="设备名称:" prop="probeName">
							<el-input maxlength="50" v-model="form.probeName" placeholder="请输入设备名称" style="width: 200px" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="设备别名:" prop="probeAsName">
							<el-input maxlength="50" v-model="form.probeAsName" placeholder="请输入设备别名" style="width: 200px" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="IP:" prop="ip">
							<el-input v-model="form.ip" placeholder="请输入IP" style="width: 200px" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="接收端口:" prop="receivePort">
							<el-input-number
								controls-position="right"
								:precision="0"
								:min="0"
								v-model="form.receivePort"
								placeholder="请输入接收端口"
								style="width: 200px"
							/>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="同步端口:" prop="portInfo">
							<el-input-number
								controls-position="right"
								:precision="0"
								:min="0"
								v-model="form.portInfo"
								placeholder="请输入同步端口"
								style="width: 200px"
							/>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="版本:" prop="version">
							<el-input maxlength="10" v-model="form.version" placeholder="请输入版本" style="width: 200px" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="分组ID:" prop="groupId">
							<el-input maxlength="10" v-model.number="form.groupId" placeholder="请输入分组ID" style="width: 200px" />
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="接收流入库方式:" prop="comments">
							<el-select v-model="form.comments" placeholder="请选择" style="width: 200px">
								<el-option v-for="(dict, index) in options.commentsOptions" :key="index" :label="dict.label" :value="dict.value"></el-option>
							</el-select>
						</el-form-item>
					</el-col>
				</el-row>
				<el-row>
					<el-col :span="24">
						<el-form-item label="是否屏蔽原始数据" prop="noRawData">
							<el-radio-group v-model="form.noRawData">
								<el-radio :label="1">是</el-radio>
								<el-radio :label="0">否</el-radio>
							</el-radio-group>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="submitForm" :loading="probeAddForm.submitButtonLoading">{{ probeAddForm.submitButtonText }}</el-button>
				<el-button @click="cancelProbeDialogHandle">取 消</el-button>
			</template>
		</el-dialog>

		<!-- 探针运行状态 -->
		<el-dialog
			:title="title"
			v-model="open.runningDialog"
			width="500px"
			append-to-body
			center
			@close="cancelRunningDialogHandle"
			:close-on-click-modal="false"
		>
			<div id="runningDialog">
				<el-form :model="runningForm" label-width="150px">
					<el-row>
						<el-col :span="24">
							<el-form-item label="探针运行状态:">
								{{ runningForm.probeStatus == 1 ? '运行中' : '未运行' }}
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="24">
							<el-form-item label="CPU使用率:">
								{{ runningForm.cpuUtilization }}
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="24">
							<el-form-item label="硬盘大小:">
								{{ runningForm.diskSize }}
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="24">
							<el-form-item label="硬盘使用率:">
								{{ runningForm.diskUtilization }}
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="24">
							<el-form-item label="内存大小:">
								{{ runningForm.memorySize }}
							</el-form-item>
						</el-col>
					</el-row>
					<el-row>
						<el-col :span="24">
							<el-form-item label="内存使用率:">
								{{ runningForm.memoryUtilization }}
							</el-form-item>
						</el-col>
					</el-row>
				</el-form>
			</div>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="cancelRunningDialogHandle">关 闭</el-button>
			</template>
		</el-dialog>

		<!-- 同步探针协议弹出框 -->
		<el-dialog
			title="探针协议列表"
			v-model="open.protocolDialog"
			width="800px"
			append-to-body
			center
			@close="cancelProtocolDialogHandle"
			:close-on-click-modal="false"
		>
			<!-- 搜索条件 -->
			<el-form :model="protocolFormData" :inline="true" :label-width="100">
				<el-form-item label="协议名称" prop="protocolName">
					<el-input v-model="protocolFormData.protocolName" placeholder="请输入协议名称" clearable class="yd-input" />
				</el-form-item>
				<el-form-item>
					<el-button type="primary" icon="Search" @click="protocolSearchHandler">查 询</el-button>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" @click="updateProtocolHandle">更新探针协议</el-button>
				</el-form-item>
			</el-form>

			<!--查询列表-->
			<div style="height: 600px">
				<YdTable
					:formData="protocolFormData"
					:tableConfig="protocolTableConfig"
					:tableData="protocolTableData"
					@sizeChangeHandler="protocolQueryGrid"
					@currentChangeHandler="protocolQueryGrid"
					@sortChangeHandler="protocolQueryGrid"
				>
				</YdTable>
			</div>
			<template #footer class="dialog-footer">
				<el-button type="primary" @click="cancelProtocolDialogHandle">关 闭</el-button>
			</template>
		</el-dialog>
	</div>
</template>

<script setup name="ProbeCaptureManage" lang="tsx">
import {
	pageInfo,
	detail,
	save,
	updateDetail,
	delProbe,
	syncBusiness,
	syncIp,
	cleanIp,
	updateStatus,
	running,
	interfaceList,
	protocolPage,
	syncProtocol,
} from '@/api/management/probeManage/probeCaptureManage';
import useCurrentInstance from '@/utils/useCurrentInstance';
import { ref, reactive, toRefs, onMounted } from 'vue';

const { proxy } = useCurrentInstance();

// 定时器
let interval = reactive<anyObj>({
	// 全局刷新
	allRefresh: null,
	// 全局刷新时间，默认20秒
	allRefreshTime: 20,
});
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
// 弹出层标题
const title = ref('');
// 表单参数
const data = reactive<anyObj>({
	form: {},
	runningForm: {},
});
const { form, runningForm } = toRefs(data);
// 是否显示弹出层
let open = reactive({
	probeAddDialog: false,
	runningDialog: false,
	protocolDialog: false,
	interfaceDialog: false,
});
//下拉框选项
let options = reactive({
	commentsOptions: [
		{ label: 'socket方式入库', value: 'socket' },
		{ label: '固定线程入库', value: 'aio_thread' },
		{ label: '动态线程入库', value: 'aio_row' },
	],
});
let probeAddForm = reactive<anyObj>({
	ids: [],
	isStatusArray: [],
	ipArray: [],
	submitButtonLoading: false,
	submitButtonText: '确 定',
});
// 表单校验
const rules = ref<any>({
	probeName: [{ required: true, message: '设备名称不能为空', trigger: 'blur' }],
	probeAsName: [{ required: true, message: '设备别名不能为空', trigger: 'blur' }],
	ip: [
		{ required: true, message: 'IP不能为空', trigger: 'blur' },
		{
			validator: function (rule: any, value: string, callback: any) {
				if (
					!/^((1[0-9][0-9]\.)|(2[0-4][0-9]\.)|(25[0-5]\.)|([1-9][0-9]\.)|([0-9]\.)){3}((1[0-9][0-9])|(2[0-4][0-9])|(25[0-5])|([1-9][0-9])|([0-9]))$/.test(
						value
					)
				) {
					callback(new Error('请输入合法IP地址'));
				} else {
					callback();
				}
			},
			trigger: 'blur',
		},
	],
	version: [{ required: true, message: '版本不能为空', trigger: 'blur' }],
	groupId: [
		{ required: true, message: '分组ID不能为空', trigger: 'blur' },
		{ type: 'number', message: '分组ID请输入数字', trigger: 'blur' },
	],
	comments: [{ required: true, message: '接收流入库方式不能为空', trigger: 'change' }],
	noRawData: [{ required: true, message: '是否屏蔽原始数据不能为空', trigger: 'change' }],
	receivePort: [{ required: true, message: '接收端口不能为空', trigger: 'blur' }],
	portInfo: [{ required: true, message: '同步端口不能为空', trigger: 'blur' }],
});
// 搜索表单数据
let formData = reactive<any>({});
const formOptions = reactive<FormOptionType>([
	{
		type: 'input',
		label: '设备名称',
		prop: 'probeName',
		attrs: {
			clearable: true,
		},
	},
	{
		type: 'input',
		label: 'IP',
		prop: 'ip',
		attrs: {
			clearable: true,
		},
	},
]);
const formBtns = reactive<BtnType[]>([
	{
		type: 'primary',
		text: '查询',
		handler: searchHandler,
	},
]);
// 列表配置
let tableConfig = reactive<TableConfigType>({
	columns: [
		{
			label: '设备名称',
			prop: 'probeName',
		},
		{
			label: '设备别名',
			prop: 'probeAsName',
		},
		{
			label: '版本',
			prop: 'version',
		},
		{
			label: 'IP',
			prop: 'ip',
		},
		{
			label: '接收端口',
			prop: 'receivePort',
			sortable: true,
		},
		{
			label: '同步端口',
			prop: 'portInfo',
		},
		{
			label: '状态',
			prop: 'isStatus',
			render: (row: anyObj, val: ApiVal) => {
				// if (proxy.checkRole(['admin']) || proxy.checkPermi(['probeConfig:enable'])) {
					return <el-switch v-model={row.isStatus} activeValue={1} inactiveValue={0} onChange={() => statusChangeHandle(row)}></el-switch>;
				// }
				// return <el-switch v-model={row.isStatus} disabled activeValue={1} inactiveValue={0}></el-switch>;
			},
		},
		{
			label: '同步业务配置状态',
			prop: 'probeSyncBusiStatus',
		},
		{
			label: '接收流入库方式',
			prop: 'comments',
			formatter(row: anyObj, val: ApiVal) {
				if (val === null || val === '' || val === undefined) {
					return '';
				} else if (val === 'socket') {
					return 'socket方式入库';
				} else if (val === 'aio_thread') {
					return '固定线程入库';
				} else if (val === 'aio_row') {
					return '动态线程入库';
				}
			},
		},
		{
			label: '分组ID',
			prop: 'groupId',
			width: 100,
			sortable: true,
		},
		{
			label: '屏蔽原始数据',
			prop: 'noRawData',
			formatter(row: anyObj, val: ApiVal) {
				if (val === null || val === '' || val === undefined) {
					return '';
				} else if (val == 0) {
					return '否';
				} else {
					return '是';
				}
			},
		},
		{
			label: '操作',
			prop: '',
			width: 200,
			operation: [
				{
					text: '运行情况',
					handler: (scope: anyObj) => getProbeRunHandle(scope.row),
				},
			],
		},
	],
	// 工具栏
	toolBar: [
		{ name: '新增', icon: 'yd-icon-plus', permi: ['probeConfig:add'], handler: () => addHandle() },
		{ name: '修改', icon: 'yd-icon-edit', permi: ['probeConfig:edit'], disable: 'single', handler: () => updateHandle() },
		{ name: '删除', icon: 'yd-icon-delete', permi: ['probeConfig:delete'], disable: 'multiple', handler: () => deleteHandle() },
		{ name: '查看探针接口', icon: 'yd-icon-list', permi: ['probeConfig:queryProbeInterface'], disable: 'single', handler: () => interfaceHandle() },
		{ name: '同步业务配置', icon: 'yd-icon-sync', permi: ['probeConfig:synchBusiness'], disable: 'multiple', handler: () => syncBusinessHandle() },
		{ name: '同步过滤Ip', icon: 'yd-icon-sync', permi: ['probeConfig:synchIp'], disable: 'multiple', handler: () => syncIpHandle() },
		{ name: '清空过滤Ip配置', icon: 'yd-icon-delete', permi: ['probeConfig:clearIp'], disable: 'multiple', handler: () => cleanIpHandle() },
		{ name: '同步探针协议', icon: 'yd-icon-sync', permi: ['probeConfig:synchProbe'], disable: 'single', handler: () => protocolSearchHandler() },
		{ name: '开启页面自动刷新', icon: 'yd-icon-sync', handler: () => startRefreshInterval(1) },
		{ name: '关闭页面自动刷新', icon: 'yd-icon-sync', handler: () => stopRefreshInterval() },
	],
	// 开启复选框
	enableSelection: true,
	// 开启分页
	pagination: {
		pageNum: 1,
		// pageSize: 10,
		// total: 0,
	},
	// 加载层
	loading: true,
});
// 列表数据
const tableData = ref<any>([]);
const conForm = ref<any>();

//查看探针接口信息----相关设置----start------
// 搜索表单数据
let interfaceFormData = reactive<anyObj>({});
// 列表配置
let interfaceTableConfig = reactive({
	columns: [
		{
			label: '接口名称',
			prop: 'interfaceName',
		},
		{
			label: '接口别名',
			prop: 'alias',
		},
		{
			label: '接口号',
			prop: 'number',
		},
		{
			label: '速率',
			prop: 'speed',
		},
		{
			label: '状态',
			prop: 'active',
			render: (row: anyObj, val: ApiVal) => {
				if (val == 1) {
					return '激活';
				} else {
					return '失活';
				}
			},
		},
	],
	// 开启复选框
	enableSelection: false,
	// 开启分页
	pagination: {
		pageNum: 1,
		pageSize: 10,
		total: 0,
	},
	// 加载层
	loading: true,
});
// 列表数据
const interfaceTableData = ref<any>([]);
//查看探针接口信息----相关设置----end------

//查看探针协议信息----协议----start------
// 搜索表单数据
let protocolFormData = reactive<anyObj>({});
// 列表配置
let protocolTableConfig = reactive({
	columns: [
		{
			label: '协议名称',
			prop: 'name',
		},
		{
			label: '更新时间',
			prop: 'modifierTime',
		},
	],
	// 开启复选框
	enableSelection: false,
	// 开启分页
	pagination: {
		pageNum: 1,
		pageSize: 10,
		total: 0,
	},
	// 加载层
	loading: true,
});
// 列表数据
const protocolTableData = ref<any>([]);
//查看探针协议信息----协议----end------

// 搜索
function searchHandler() {
	// tableConfig.pagination.pageNum = 1;
	queryGrid();
}
//查询列表数据
function queryGrid() {
	tableConfig.loading = true;
	console.log();
	pageInfo(formData).then((res: ApiResponse) => {
		if (res.code !== 0) {
			proxy.$modal.msgWarning(res.msg);
			tableConfig.loading = false;
			return;
		}
		tableConfig.loading = false;
		tableData.value = res.data.records;
		tableConfig.pagination!.total = res.data.total;
	});
}
// 多选框选中数据
function handleSelectionChange(selection: any) {
	probeAddForm.ids = selection.map((item: anyObj) => item.id);
	single.value = selection.length != 1;
	multiple.value = !selection.length;
	probeAddForm.isStatusArray = selection.map((item: anyObj) => item.isStatus);
	probeAddForm.ipArray = selection.map((item: anyObj) => item.ip);
}
/** 新增按钮操作 */
function addHandle() {
	reset();
	title.value = '增加探针信息';
	form.value.receivePort = 0;
	form.value.portInfo = 0;
	open.probeAddDialog = true;
	probeAddForm.submitButtonLoading = false;
	probeAddForm.submitButtonText = '确 定';
}
/** 修改按钮操作 */
function updateHandle() {
	reset();
	title.value = '修改探针信息';
	open.probeAddDialog = true;
	probeAddForm.submitButtonLoading = false;
	probeAddForm.submitButtonText = '确 定';
	const id = probeAddForm.ids;
	if (id == null || id == '') {
		proxy.$modal.msgWarning('请选择要修改的探针信息。');
		return;
	}
	detail(id).then((response) => {
		form.value = response.data;
	});
}
/** 删除按钮操作 */
function deleteHandle() {
	const ids = probeAddForm.ids;
	if (ids == null) {
		proxy.$modal.msgWarning('请选择要删除的探针信息。');
		return;
	}
	proxy.$modal
		.confirm('是否需要删除已经勾选的探针数据?', '警告', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			cancelButtonClass: 'confirm-rigth-cancel-button',
			type: 'warning',
		})
		.then(() => {
			delProbe(ids).then((res) => {
				if (res.code === 0) {
					proxy.$modal.msgSuccess('删除成功');
					searchHandler();
				} else {
					proxy.$modal.msgWarning(res.msg);
				}
			});
		})
		.catch(() => {});
}
// 修改按钮状态
function changeButoon() {
	console.log(222);
	probeAddForm.submitButtonLoading = false;
	probeAddForm.submitButtonText = '确 定';
}
/** 提交按钮 */
function submitForm() {
	conForm.value.validate((valid: any) => {
		if (valid) {
			probeAddForm.submitButtonLoading = true;
			probeAddForm.submitButtonText = '提交中...';
			//新增或者修改提交前先校验表达式
			if (form.value.id != undefined) {
				updateDetail(form.value).then((response) => {
					changeButoon();
					if (response.code === 0) {
						proxy.$modal.msgSuccess('修改成功');
						open.probeAddDialog = false;
						searchHandler();
					} else {
						proxy.$modal.msgWarning(response.msg);
						if (response.msg === '相同IP下设备名称不能重复或者为空') {
							rules.probeName = [
								{ required: true, message: '设备名称不能为空', trigger: 'blur' },
								{
									validator: (rule: any, value: any, callback: any) => {
										callback(new Error('相同IP下设备名称不能重复或者为空'));
									},
									trigger: 'blur',
								},
							];
							conForm.value.validate((valid: any) => {});
							rules.probeName.pop();
						}
						return;
					}
				});
			} else {
				save(form.value).then((response) => {
					changeButoon();
					if (response.code === 0) {
						proxy.$modal.msgSuccess('新增成功');
						open.probeAddDialog = false;
						searchHandler();
					} else {
						proxy.$modal.msgWarning(response.msg);
						if (response.msg === '相同IP下设备名称不能重复或者为空') {
							rules.probeName = [
								{ required: true, message: '设备名称不能为空', trigger: 'blur' },
								{
									validator: (rule: any, value: any, callback: any) => {
										callback(new Error('相同IP下设备名称不能重复或者为空'));
									},
									trigger: 'blur',
								},
							];
							conForm.value.validate((valid: any) => {});
							rules.probeName.pop();
						}
						return;
					}
				});
			}
		}
	});
}
// 取消按钮
function cancelProbeDialogHandle() {
	open.probeAddDialog = false;
	reset();
}
// 表单重置
function reset() {
	form.value = {
		probeName: undefined,
		probeAsName: undefined,
		version: undefined,
		ip: undefined,
		isStatus: undefined,
		comments: undefined,
		groupId: undefined,
		noRawData: undefined,
	};
	conForm.value?.resetFields();
}
//状态激活和失活
function statusChangeHandle(row: anyObj) {
	const isStatus = row.isStatus;
	let text = '激活';
	if (isStatus == 0) {
		text = '失活';
	}
	proxy.$modal
		.confirm('确定' + text + '吗？', '警告', {
			confirmButtonText: '确定',
			cancelButtonText: '取消',
			cancelButtonClass: 'confirm-rigth-cancel-button',
			type: 'warning',
		})
		.then(() => {
			updateStatus({ id: row.id, isStatus: isStatus }).then((response) => {
				if (response.code === 0) {
					proxy.$modal.msgSuccess(text + '成功');
          setTimeout(() => {
            searchHandler();
          }, 200);
        } else {
					// 修改状态失败后台返回Code:1
					row.isStatus = row.isStatus === 0 ? 1 : 0;
					proxy.$modal.msgWarning(response.msg);
					return;
				}
			});
		})
		.catch(function () {
			row.isStatus = row.isStatus === 0 ? 1 : 0;
		});
}
//查看运行情况
function getProbeRunHandle(row: anyObj) {
	title.value = '探针运行状态';
	running(row.id).then((response) => {
		if (response.code === 0) {
			runningForm.value = response.data;
			open.runningDialog = true;
		} else {
			proxy.$modal.msgWarning(response.msg);
			return;
		}
	});
}
//同步业务
function syncBusinessHandle() {
	const isStatusArray = probeAddForm.isStatusArray;
	if (isStatusArray != null && isStatusArray.length > 0) {
		for (var i = 0; i < isStatusArray.length; i++) {
			if (isStatusArray[i] == 0) {
				proxy.$modal.msgWarning('探针处于失活状态，请在探针管理激活后再同步！');
				return;
			}
		}
	}
	const ids = probeAddForm.ids;
	syncBusiness({ idList: ids }).then((response: ApiResponse) => {
		if (response.code === 0) {
			proxy.$modal.msgSuccess('正在同步，开启自动刷新列表');
			//开启自动刷新，先刷新一下列表
			startRefreshInterval(0);
			queryGrid();
			const data = tableData.value;
			const failIds = response.data.failIds;
			const successIds = response.data.successIds;
			if (data != null && data.length > 0) {
				for (var i = 0; i < data.length; i++) {
					const item = data[i];
					if (successIds != null && successIds.length > 0) {
						for (var j = 0; j < successIds.length; j++) {
							if (item.id == successIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(同步成功)';
							}
						}
					}
					if (failIds != null && failIds.length > 0) {
						for (var j = 0; j < failIds.length; j++) {
							if (item.id == failIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(同步失败)';
							}
						}
					}
				}
			}
		} else {
			proxy.$modal.msgWarning(response.msg);
			return;
		}
	});
}
//同步过滤ip
function syncIpHandle() {
	const isStatusArray = probeAddForm.isStatusArray;
	if (isStatusArray != null && isStatusArray.length > 0) {
		for (var i = 0; i < isStatusArray.length; i++) {
			if (isStatusArray[i] == 0) {
				proxy.$modal.msgWarning('探针处于失活状态，请在探针管理激活后再同步！');
				return;
			}
		}
	}
	const ids = probeAddForm.ids;
	syncIp({ idList: ids }).then((response: ApiResponse) => {
		if (response.code === 0) {
			proxy.$modal.msgSuccess('同步成功');
			const data = tableData.value;
			const failIds = response.data.failIds;
			const successIds = response.data.successIds;
			if (data != null && data.length > 0) {
				for (var i = 0; i < data.length; i++) {
					const item = data[i];
					if (successIds != null && successIds.length > 0) {
						for (var j = 0; j < successIds.length; j++) {
							if (item.id == successIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(同步成功)';
							}
						}
					}
					if (failIds != null && failIds.length > 0) {
						for (var j = 0; j < failIds.length; j++) {
							if (item.id == failIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(同步失败)';
							}
						}
					}
				}
			}
		} else {
			proxy.$modal.msgWarning(response.msg);
			return;
		}
	});
}
//清空过滤ip
function cleanIpHandle() {
	const isStatusArray = probeAddForm.isStatusArray;
	if (isStatusArray != null && isStatusArray.length > 0) {
		for (var i = 0; i < isStatusArray.length; i++) {
			if (isStatusArray[i] == 0) {
				proxy.$modal.msgWarning('探针处于失活状态，请在探针管理激活后再清空！');
				return;
			}
		}
	}
	const ids = probeAddForm.ids;
	cleanIp({ idList: ids }).then((response: ApiResponse) => {
		if (response.code === 0) {
			proxy.$modal.msgSuccess('清空成功');
			const data = tableData.value;
			const failIds = response.data.failIds;
			const successIds = response.data.successIds;
			if (data != null && data.length > 0) {
				for (var i = 0; i < data.length; i++) {
					const item = data[i];
					if (successIds != null && successIds.length > 0) {
						for (var j = 0; j < successIds.length; j++) {
							if (item.id == successIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(清空成功)';
							}
						}
					}
					if (failIds != null && failIds.length > 0) {
						for (var j = 0; j < failIds.length; j++) {
							if (item.id == failIds[j]) {
								let tempIp = item.ip;
								let num = tempIp.indexOf('(');
								if (num != -1) {
									tempIp = tempIp.substring(0, num);
								}
								item.ip = tempIp + '(清空失败)';
							}
						}
					}
				}
			}
		} else {
			proxy.$modal.msgWarning(response.msg);
			return;
		}
	});
}
//关闭运行情况弹出框
function cancelRunningDialogHandle() {
	open.runningDialog = false;
}
//查看探针接口信息
function interfaceHandle() {
	const ids = probeAddForm.ids;
	if (ids != null && ids.length > 0) {
		(interfaceTableData.value = []), (interfaceTableConfig.pagination.total = 0);
		interfaceQueryGrid(ids[0]);
		title.value = '探针协议列表';
		open.interfaceDialog = true;
	}
}
//查询探针接口数据
function interfaceQueryGrid(id: any) {
	interfaceFormData.id = id;
	interfaceList(interfaceFormData).then((res: ApiResponse) => {
		if (res.code !== 0) {
			proxy.$modal.msgWarning(res.msg);
			interfaceTableConfig.loading = false;
			return;
		}
		interfaceTableConfig.loading = false;
		interfaceTableData.value = res.data.records;
		interfaceTableConfig.pagination.total = res.data.total;
	});
}
//查看探针协议
function protocolHandler() {
	protocolFormData.protocolName = null;
	protocolSearchHandler();
}
//点击搜索探针协议
function protocolSearchHandler() {
	protocolTableConfig.loading = true;
	protocolTableConfig.pagination.pageNum = 1;
	open.protocolDialog = true;
	protocolQueryGrid();
}
//探针协议翻页查询
function protocolQueryGrid() {
	protocolPage(protocolFormData).then((res: ApiResponse) => {
		if (res.code !== 0) {
			proxy.$modal.msgWarning(res.msg);
			protocolTableConfig.loading = false;
			return;
		}
		protocolTableConfig.loading = false;
		protocolTableData.value = res.data.records;
		protocolTableConfig.pagination.total = res.data.total;
	});
}
//关闭探针协议
function cancelProtocolDialogHandle() {
	protocolFormData.protocolName = undefined;
	protocolTableConfig.pagination.pageNum = 1;
	protocolTableConfig.pagination.pageSize = 10;
	open.protocolDialog = false;
}
//更新探针协议
function updateProtocolHandle() {
	//获取当前勾选的ip
	const ips = probeAddForm.ipArray;
	if (ips != null && ips.length > 0) {
		syncProtocol(ips[0]).then((response) => {
			if (response.code === 0) {
				proxy.$modal.msgSuccess('更新成功');
			} else {
				proxy.$modal.msgWarning(response.msg);
				return;
			}
		});
	}
}
//关闭接口弹出框
function cancelInterfaceDialogHandle() {
	open.interfaceDialog = false;
}
//开启定时刷新列表
function startRefreshInterval(tag: number) {
	// 确保定时器已销毁
	clearInterval(interval.allRefresh);
	interval.allRefresh = setInterval(() => {
		queryGrid();
	}, 1000 * interval.allRefreshTime);
	if (tag == 1) {
		proxy.$modal.msg('开启自动刷新成功');
	}
}
//销毁定时器
function stopRefreshInterval() {
	clearInterval(interval.allRefresh);
	proxy.$modal.msg('关闭自动刷新成功');
}

onMounted(() => {
    searchHandler();
    protocolQueryGrid();
});
</script>

<style lang="scss" scoped>
.container {
	margin: 10px;
}
</style>
